import ReactDOM from 'react-dom'
import SmsVerify from "./SmsVerify"

class SmsVerifyHandler {
  el = null

  show(options={}) {
    this.checkAndNewMountedDom()
    !!this.el && ReactDOM.render(
      <SmsVerify 
        mobile={options.mobile}
        close={()=>this.hide()} 
        send={options.send}
        confirm={e=>{
          !!options.confirm && options.confirm(e)
          !options.isCloseHide && this.hide()
        }}
      />
      , this.el
    )
  }

  hide() {
    const dom = document.getElementById('sms-verify')
    dom?.remove()
  }

  checkAndNewMountedDom() {
    let dom = document.getElementById('sms-verify')
    if (!dom) {
      dom = document.createElement('div')
      dom.id = 'sms-verify'
      document.body.append(dom)
    }
    this.el = dom
  }
}

export default new SmsVerifyHandler()